<template>
	<view class="flex ct page">
		
		<view class="white">
			
			<view>
				<view class="pb20 text-center">
					<view class="fz90 sIcon-mobile"></view>
				</view>
				
				<view class="text-center">
					<view class="fz24">用户登录</view>
					<view class="fz14 pt5" style="opacity: 0.8;">
						进入系统之前请确保管理员已为您创建账号
					</view>
					<view class="fz14 pt5" style="opacity: 0.8;">
						请使用微信授权手机号码登录系统
					</view>
				</view>
				
				<view class="text-center flex bk pd pt100">
					<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="btn whiteBg main plr35 shadow mt15 rds25">
						立即授权登录
					</button>
					<navigator url="/pages/applyServicer/applyServicer" class="btn line whiteBg main plr35 shadow mt15 rds25">
						运维公司入驻
					</navigator>
					<view class="pt30 op8" @tap="kit.goBack()">
						取消
					</view>
				</view>
			</view>
			
			<view class="grayCirle left"></view>
			<view class="grayCirle right"></view>
			
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				needVerify : "no" ,
				jsCode : null 
			}
		},
		
		onLoad(params) {
			this.needVerify = params.needVerify || "no" ;
			this.getCode();
			
			// #ifdef H5
			if (process.env.NODE_ENV === 'development') {
				this.kit.get("/api/test/getTestUserInfo",{},res => {
					this.loading = false ;
					this.isLogin = res.isLogin ;
					uni.setStorageSync("token" , res.data.token );
					uni.setStorageSync("role" , res.data.role);
					this.role = uni.getStorageSync("role");
					this.kit.goBack();
				});
				return ;
			}
			// #endif
			
		},
		
		methods: {
			
			getCode:function(e){
				wx.login({
					success: (result) => {
						this.jsCode = result.code ;
					}
				});
			},
			
			getPhoneNumber:function(e){
				if(e.detail.errMsg != 'getPhoneNumber:ok'){
					return ;
				}
				var data = {
					js_code : this.jsCode ,
					encryptedData : e.detail.encryptedData ,
					iv : e.detail.iv 
				};
				this.kit.get("/api/wxuser/login",data,e => {
					console.log(e);
					this.getCode();
					if(e.needChooseRole){
						var list = e.list ;
						uni.showActionSheet({
							itemList: e.roles ,
							success: (e) => {
								var index = e.tapIndex ;
								this.loginSuccess(list[index]);
							}
						})
						return ;
					}
					this.loginSuccess(e.data);
				} , e => {
					console.log(e);
					this.getCode();
					this.kit.showTips(e.err);
					// uni.showToast({
					// 	title: e.e,
					// 	icon : 'none'
					// });
				});
			},
			
			loginSuccess:function(e){
				console.log(e);
				uni.setStorageSync("token" , e.token);
				uni.setStorageSync("role" , e.role );
				var beforeLoginUrl= uni.getStorageSync("beforeLoginUrl");
				if (!beforeLoginUrl) {
					this.kit.goBack();
					return ;
				}
				uni.removeStorageSync("beforeLoginUrl");
				uni.redirectTo({
					url: beforeLoginUrl
				});
			},
			
		}
	}
</script>

<style lang="scss">
page,.page{
	background-color: $main;
	width: 100%;
	height: 100%;
}

.sImg{
	width: 240upx;
}

.grayCirle{
	background-color:#4590ff;
	width: 100px;
	height: 100px;
	border-radius: 100%;
}

.grayCirle.left{
	position: fixed;
	left: -14%;
	bottom: 200upx;
}

.grayCirle.right{
	position: fixed;
	right: -14%;
	top: 20%;
}

.gradualBg,.btn{
	padding: 18upx 70upx;
	font-size: 30upx;
}
</style>
